<template>
  <div class="app-container">
    <div class="filter-container">
      <el-form class="approve-form" ref="approve" :rules="rules" :model="obj" label-position="right" label-width="auto">
        <el-form-item label="审批单编号" prop="approveOrderCode">
          <span>{{obj.approveOrderCode}}</span>
        </el-form-item>
        <el-form-item label="审批单名称" prop="approveOrderName">
          <span>{{obj.approveOrderName}}</span>
        </el-form-item>
        <el-form-item label="当前审批节点名称" prop="approveOrderName">
          <span>{{obj.currentName}}</span>
        </el-form-item>
        <el-form-item label="审批结果" prop="approveResult">
          <el-radio-group v-model="obj.approveResult" @change="changeApproveResult">
            <el-radio-button v-for="(item,index) in getEnumList('ApproveResult')" :label="item.key" :key="index">{{item.value}}</el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="审批意见" prop="approveOpinion">
          <el-input v-model="obj.approveOpinion" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="审批签名">
          <userSign />
        </el-form-item>
        <div style="text-align:right;">
          <el-button type="primary" @click="doApprove('approve')">确定</el-button>
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().budgetProjectTwo">
          <h1>预算控制-二级项目信息</h1>
          <el-divider border-style="dashed" />
          <projectTwoPreview :projectTwoId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().budgetOne">
          <h1>预算控制-一上预算编制信息</h1>
          <el-divider border-style="dashed" />
          <budgetOneDetail :budgetOneId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().budgetTwo">
          <h1>预算控制-二上预算编制信息</h1>
          <el-divider border-style="dashed" />
          <budgetTwoDetail :budgetTwoId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().budgetNew"></div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().budgetAdjust"></div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().expenditureKpi">
          <h1>收支控制-指标单</h1>
          <el-divider border-style="dashed" />
          <expenditureKpiDetail :expenditureKpiId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().expenditureQuota">
          <h1>收支控制-额度下达单</h1>
          <el-divider border-style="dashed" />
          <expenditureQuotaDetail :expenditureQuotaId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().expenditureAdjustment">
          <h1>收支控制-调整单</h1>
          <el-divider border-style="dashed" />
          <expenditureAdjustmentDetail :expenditureAdjustmentId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().expenditureApplication">
          <h1>收支控制-事前用款申请单</h1>
          <el-divider border-style="dashed" />
          <expenditureApplicationDetail :expenditureApplicationId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().expenditureReimbursement">
          <h1>收支控制-报账单</h1>
          <el-divider border-style="dashed" />
          <expenditureReimbursementDetail :expenditureReimbursementId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().expenditureReimbursementOther">
          <h1>收支控制-其他报账单</h1>
          <el-divider border-style="dashed" />
          <expenditureReimbursementOtherDetail :expenditureReimbursementOtherId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractInitial">
          <h1>合同管理-初始合同</h1>
          <el-divider border-style="dashed" />
          <contractInitialDetail :contractInitialId="obj.businessId" />
        </div>
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractMain">
          <h1>合同管理-主合同</h1>
          <el-divider border-style="dashed" />
          <contractMainDetail :contractInitialId="obj.businessId" />
        </div>

         <!--合同变更-->
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractChange">
          <contractChangeDetail :contractChangeId="obj.businessId" />
        </div>
        <!--合同借阅-->
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractBorrow">
          <contractBorrowingDetail :contractBorrowingId="obj.businessId" />
        </div>
        <!--合同请款-->
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractCash">
          <contractCashDetail :contractCashId="obj.businessId" />
        </div>
        <!--补充协议-->
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractSupplemental">
          <contractSupplementalDetail :contractSupplementalId="obj.businessId" />
        </div>
        <!--合同验收-->
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractChecking">
          <contractCheckingDetail :contractCheckingId="obj.businessId" />
        </div>
        <!--合同中止-->
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractInterrupt">
          <contractInterruptDetail :contractInterruptId="obj.businessId" />
        </div>
        <!--合同终止-->
        <div v-if="obj.businessType === approveOrderBusinessTypes().contractTerminate">
          <contractTerminateDetail :contractTerminateId="obj.businessId" />
        </div>
      </el-form>
    </div>
  </div>
</template>
<script>
import baseConfig from "@/mixins/baseConfig";
import {doGet, doPost} from "@/config/http";
import projectTwoPreview from '@/views/components/budget/projectTwoPreview.vue'
import budgetOneDetail from '@/views/components/budget/budgetOneDetail.vue'
import budgetTwoDetail from '@/views/components/budget/budgetTwoDetail.vue'
import expenditureKpiDetail from '@/views/components/expenditure/expenditureKpiDetail.vue'
import expenditureQuotaDetail from '@/views/components/expenditure/expenditureQuotaDetail.vue'
import expenditureAdjustmentDetail from '@/views/components/expenditure/expenditureAdjustmentDetail.vue'
import expenditureApplicationDetail from '@/views/components/expenditure/expenditureApplicationDetail.vue'
import expenditureReimbursementDetail from '@/views/components/expenditure/expenditureReimbursementDetail.vue'
import expenditureReimbursementOtherDetail from '@/views/components/expenditure/expenditureReimbursementOtherDetail.vue'
import contractInitialDetail from '@/views/components/contract/contractInitialDetail.vue'
import contractMainDetail from '@/views/components/contract/contractMainDetail.vue'

import contractChangeDetail from '@/views/components/contract/contractChangeDetail.vue'

import contractBorrowingDetail from '@/views/components/contract/contractBorrowingDetail.vue'
import contractCashDetail from '@/views/components/contract/contractCashDetail.vue'
import contractSupplementalDetail from '@/views/components/contract/contractSupplementalDetail.vue'
import contractCheckingDetail from '@/views/components/contract/contractCheckingDetail.vue'
import contractInterruptDetail from '@/views/components/contract/contractInterruptDetail.vue'
import contractTerminateDetail from '@/views/components/contract/contractTerminateDetail.vue'

import {alertErrorMsg, customValidator, notifySuccess, svc} from "@/config/common";
import useUserStore from "@/store/modules/user";
import userSign from "@/views/profile/userSign.vue";
import {approveOrderBusinessTypes} from "@/config/common";

export default {
  name: 'approveOrderForm_nocache',
  mixins: [baseConfig],
  components: {
    userSign,
    projectTwoPreview,
    budgetOneDetail,
    budgetTwoDetail,
    expenditureKpiDetail,
    expenditureQuotaDetail,
    expenditureAdjustmentDetail,
    expenditureApplicationDetail,
    expenditureReimbursementDetail,
    expenditureReimbursementOtherDetail,
    contractInitialDetail,
    contractMainDetail,
    contractChangeDetail,
    contractBorrowingDetail,
    contractCashDetail,
    contractSupplementalDetail,
    contractCheckingDetail,
    contractInterruptDetail,
    contractTerminateDetail
  },
  data() {
    return {
      svc: 'icims-api',
      routes: [],
      rules: {
        approveResult: [{required: true, validator: customValidator, min: 0, max: 20, label: '审批结果', trigger: ['blur', 'change']}],
        approveOpinion: [{required: false, validator: customValidator, min: 0, max: 20, label: '审批意见', trigger: ['blur', 'change']}],
      },
      id: null,
      obj: {},
    }
  },
  computed: {
  },
  created() {
    this.initObj()
  },
  methods: {
    useUserStore,
    approveOrderBusinessTypes,
    async initObj() {
      if (this.$route.query.id) {
        this.id = this.$route.query.id
        this.obj = await doGet(svc, `/approve-order/${this.id}`, {}, true)
        this.obj.approveResult = ''
        this.obj.approveOpinion = ''
        console.log('obj', this.obj)
      }
    },
    changeApproveResult() {
      this.rules.approveOpinion[0].required = this.obj.approveResult === '3';
    },
    doApprove(formName) {
      this.$refs[formName].validate(async valid => {
        if (!valid) {
          // alertErrorMsg('表单验证不通过，请检查数据。')
          return
        }
        let o = {}
        o.approveOrderId = this.obj.id
        o.approveResult = this.obj.approveResult
        o.approveOpinion = this.obj.approveOpinion
        if (o.approveResult === '3' && !o.approveOpinion) {
          alertErrorMsg('请输入审批意见')
          return
        }
        doPost(svc, '/customApprove/sendApprove', o).then(() => {
          notifySuccess('操作成功')
          this.dialogApproveVisible = false
          this.goTargetByName('Index')
        })
      })
    },
  },
}
</script>
